<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column prop="email" label="邮箱" width="180" />
    <el-table-column prop="userid" label="用户id" width="180" />
    <el-table-column prop="username" label="姓名" />
    <el-table-column prop="createTime" label="创建时间" />
    <el-table-column prop="sex" label="性别">
      <template #default="scope">
        <el-tag :type="scope.row.createTime === -1 ? 'error' : 'success'">{{
          scope.row.createTime === -1 ? "男" : "女"
        }}</el-tag>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import UserApiService from "@/api/user";
import dayjs from "dayjs";
export default {
  name: "AppUser",
  data() {
    return {
      tableData: [],
    };
  },
  created() {
    this.init();
  },
  methods: {
    async init() {
      const res = await UserApiService.getUserListApi();
      if (res.length > 10) {
        this.tableData = res.slice(0, 10);
        this.tableData.forEach((item) => {
          item.createTime = dayjs(item.createTime).format(
            "YYYY-MM-DD HH:mm:ss"
          );
        });
      }
    },
  },
};
</script>

<style lang="scss" scoped></style>
